@charset "utf-8";
/**
*@author: 李刚
*@功能:Normalize.css 是一个可以定制的CSS文件，它让不同的浏览器在渲染网页元素的时候形式更统一
*@file: normalize-zh.css v3.0.3
*@update: 2017年11月17日 11:30:13;
*@copyright: 基于normalize.css 源码解读与注释翻译
*/

/* ==========================================================================
一：Base基本设置    1111111111111111111111111111111111111111111111111111111111
========================================================================== */
/**
* 1. Set default font family to sans-serif.
* 2. Prevent iOS text size adjust after orientation change, without disabling
*    user zoom.*
* 1. 设置默认字体类型为 sans-serif.
* 2. 当用户放大或缩小页面时不改变字体大小。
*/
html {
  font-family: sans-serif, Arial,Helvetica,"\5b8b\4f53"; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-text-size-adjust: 100%; /* 2 */
  -o-text-size-adjust: 100%; /* 2 */
  text-size-adjust: 100%; /* 2 */
  color: #000;
  background: #f9f9f9;
  overflow-y:auto;
}
/**
* Remove default margin.
*修复默认边距，统一各浏览器效果
* 删除默认边距。
*/
ul,li,ol{
  list-style: none;
}


/**
* Remove border when inside `a` element in IE 8/9.*
* 删除 IE 8/9 中当内容位于 'a' 中出现的边框。
* 去除 IE6-9 和 Firefox 3 中 a 内部 img 元素默认的边框
*/
img {border: 0;}

/* ==========================================================================
二：  HTML5 display definitionsHTML5  2222222222222222222222222222222222222222
@新增元素定义
========================================================================== */

/**
* Correct `block` display not defined in IE 8/9.*
* 修复IE 8/9，HTML5新元素不能正确显示的问题，定义为 block的元素
* 修复IE 10/11，'details' or 'summary' 定义为 block 的元素
* 修复IE 11，'main'定义为 block 的元素
*/
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {display: block; margin:0;  padding:0;}


/*清楚标签默认样式*/
html,body,div,p,dl,dt,dd,ul,ol,li,span,a,img,h1,h2,h3,h4,h5,h6,input,button,textarea,p,blockquote,table,legend,th,td,header,nav,main,article,section,aside,details,figcaption,hgroup,menu,summary,figure,footer,small,address,option{
  margin:0;
  padding:0;
}

/**
* 1. 修复IE 8/9，HTML5新元素不能正确显示的问题，定义为inline-block元素
* 2. 修复Chrome, Firefox, 和Opera的'progress'元素没有以baseline垂直对齐
*/
audio,canvas,progress,video {display: inline-block; vertical-align: baseline; /* 2 */}

/**
* Prevent modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices.*
* 阻止现在浏览器显示未定义 control 播放控件的 'audio' 声音元素。
* 对不支持'controls'属性的浏览器，'audio'元素给以隐藏
* 移除iOS5设备中多余的高度
*/
audio:not([controls]) {display: none;height: 0;}

/**
* 修复 IE 7/8/9，Firefox 3 和 Safari 4 中 「hidden」属性不起作用的问题
* 在IE、Safari、Firefox 22- 中隐藏「template」元素
*/
[hidden],template {display: none;}

/* ==========================================================================
Figures/Figure 图像/图表/代码等
========================================================================== */
/**
* Address margin not present in IE 8/9 and Safari 5.
*修复 IE 8/9、Safari中margin失效、 修复没有的边距。
*/
figure {margin: 0;}

/* ==========================================================================
三、Links链接  333333333333333333333333333333333333333333333333333333333333333
========================================================================== */

/**
* 去掉 IE 10+ 点击链接时的灰色背景
*/
a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects; /* 2 */
  -moz-text-decoration-skip: objects; /* 2 */
  -ms-text-decoration-skip: objects; /* 2 */
  -o-text-decoration-skip: objects; /* 2 */
  text-decoration-skip: objects; /* 2 */
}

/**
* Improve readability when focused and also mouse hovered in all browsers.*
* 为所有浏览器改善当激活或悬停在元素上时元素内容的可读性。
* 去掉点击时的焦点框，同时保证使用键盘可以显示焦点框
*/
a:active,a:hover {outline: 0; text-decoration: none;list-style: none;}

/**
* Address `outline` inconsistency between Chrome and other browsers.*
* 处理 Chrome 与其它浏览器中关于 'outline' 的不一致性。
*/
a:focus {outline: none;text-decoration: none;list-style: none;}


/* ==========================================================================
四、@Typography排版    4444444444444444444444444444444444444444444444444444444
四、@语义化文字标签修复
========================================================================== */

/**
* Address variable `h1` font-size and margin within `section` and `article`
* contexts in Firefox 4+, Safari 5, and Chrome.*
* 处理多变的 'h1' 字体大小及其在 Firefox 4+, Safari 5, 及 Chrome时浏览器中的
* 'section' 与　'article' 元素中的边距。
*/
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
* Address styling not present in IE 8/9, Safari 5, and Chrome.
* 修正「abbr」元素在 Firefox 外其他浏览器没有下划线的问题
* 处理在 IE 8/9, Safari 5, 及 Chrome 没有的样式。
*/
abbr[title] {
  border-bottom: 1px dotted;
  text-decoration: underline dotted; /* 2 */
}

/**
* Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
* Firefox3+，Safari4/5 和 Chrome 中统一设置为粗体
* 处理 Firefox 4+, Safari 5, 及 Chrome 中默认的 'bolder' 样式为　'bold'.
*/
b,strong {font-weight: bold;}

/**
* Address styling not present in Safari 5 and Chrome.*
* 处理在 Safari 5 和 Chrome 没有的样式。
*/
dfn {font-style: italic;}

/**
* Address differences between Firefox and other browsers.*
* 处理　Firefox　与其它浏览器的差异。
*/
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-box-sizing: content-box;
  -ms-box-sizing: content-box;
  -o-box-sizing: content-box;
  height: 0;
}

/**
* Address styling not present in IE 8/9.
*修正 IE6-11 中没有样式的问题
*/
mark {background: #ff0;color: #000;}

/**
* Address inconsistent and variable font size in all browsers.
* 统一 small 的字体大小
* 处理所有浏览器中字体大小的不一致性[译者注：原文直译为：处理所有
* 浏览器中的不一致和多变的字体大小]。
*/
small {font-size: 80%;}

/**
* Correct font family set oddly in Safari 5 and Chrome.
* 统一代码的字体设置
* 修正确 Safari 5 和 Chrome 中古怪的默认字体。
*/

code,
kbd,
pre,
samp {
  font-family: serif, sans-serif, Arial,Helvetica,monospace;
  font-size: 1em;/* 2 */
}

/**
* Improve readability of pre-formatted text in all browsers.*
* 为所有浏览器改善预格式化文本的可读性。
* 标签应当包含滚溢出
*/
pre {
  white-space: pre-wrap;
  overflow: auto;
}

/**
* Set consistent quote types.*
* 设置一致的引用格式。
*/
q {quotes: "\201C" "\201D" "\2018" "\2019";}

/**
* Prevent `sub` and `sup` affecting `line-height` in all browsers.*
* 阻止所有浏览器中 'sub' 和 'sup' 元素影响 'line-height'.
* [译者注：就是不让上标与下标影响行高。]
*/
sub,sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* ==========================================================================
五、Embedded content嵌入的内容  5555555555555555555555555555555555555555555555
========================================================================== */


/**
* Correct overflow displayed oddly in IE 9.
* 修复 IE9 中的「overflow」的怪异表现
* 修正 IE 9 中显示古怪的溢出内容。
*/
svg:not(:root) {overflow: hidden;}


/* ==========================================================================
六、Forms表单   66666666666666666666666666666666666666666666666666666666666666
========================================================================== */
/**
* 1. Correct font family not being inherited in all browsers.
* 2. Correct font size not being inherited in all browsers.
* 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
* 1. 修正所有浏览器中颜色不继承的问题
* 2. 修正所有浏览器中字体不继承的问题
* 3. 修正 Firefox 3+， Safari5 和 Chrome 中外边距不同的问题
*/
button,optgroup,select,textarea,option {
  font-family: inherit; /* 1 */
  color: inherit; /* 1 */
  font: inherit; /* 2 */
  font-size: 100%; /* 2 */
  margin: 0; /* 3 */

  outline:none;
  -webkit-appearance:none;
  appearance:none;
  -moz-appearance:none; /* Firefox */
  -ms-appearance:none; /* Safari 和 Chrome */
  -o-appearance:none; /* Safari 和 Chrome */
  /*禁止点击时候的效果*/
  -webkit-tap-highlight-color:rgba(255,255,255,0);
}

/**
* 1. 避免 Android 4.0.* 中的 WebKit bug ，该bug会破坏原生的`audio`和`video`的控制器
* 2. 更正 iOS 中无法设置可点击的`input`的问题
* 3. 统一其他类型的`input`的光标样式
*/
button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button; /* 2 */
  appearance:button;
  -moz-appearance:button; /* Firefox */
  -ms-appearance:button; /* Safari 和 Chrome */
  -o-appearance:button; /* Safari 和 Chrome */
  cursor: pointer; /* 3 */
}

/**
* Re-set default cursor for disabled elements.
* 重置按钮禁用时光标样式
* 重置不可用元素的默认光标样式。
*/
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
* 统一各浏览器`text-transform`不会继承的问题
*/
button,select {text-transform: none;}

/**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.*
* 统一设置`input`、`button`行高为`normal`
* 处理 Firefox 4+ 中的客户端样式表里使用 '!important' 设置的 'line-height'.
*/
button,input {line-height: normal; overflow: visible;}

/**
* Remove inner padding and border in Firefox 4+.*
* 删除 Firefox 4+ button 与 input 上的内边距。
* 移除 Firefox 4+ 的内边距
*/
button::-moz-focus-inner,input::-moz-focus-inner {border: 0;padding: 0;}

/*禁止点击时候的效果*/
a,img,button,input,textarea{
  -webkit-tap-highlight-color:rgba(255,255,255,0);
}


/*去掉textarea,input的默认样式（IOS上的圆角及内阴影等，Android未测试）*/
textarea,button{
  -webkit-appearance: none; /* 1 */
  -moz-appearance: none; /* 1 */
  -ms-appearance: none; /* 1 */
  -o-appearance: none; /* 1 */
  appearance: none; /* 1 */
}

/**
* Restore the focus styles unset by the previous rule.
*/

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
* 统一 IE 8/9/10/11 `overflow`属性为`visible`
*/
button {overflow: visible;}


/**
* Define consistent border, margin, and padding.*
* 定义一致的边框、外边距及内边距。
*/
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct `color` not being inherited in IE 8/9.
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
* 1. 修正 IE 6-9 中颜色不能继承的问题*
* 2. 去掉内边距，避免当用户清空表单组时认为出错了。/ 重置内边距
*/
legend {
  border: 0; /* 1 */
  padding: 0; /* 2 */
}

/**
* 1. Address box sizing set to `content-box` in IE 8/9.
* 2. Remove excess padding in IE 8/9.*
* 1. 处理 IE 8/9 中设置为 'content-box' 的盒子模型。
* 2. 删除 IE 8/9 中多余的内边距。
*/
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
* 修正 Chrome 中 input [type="number"] 在特定高度和`font-size`时,
* 下面一个箭头光标变成`cursor: text`
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
* Remove inner padding and search cancel button in Safari 5 and Chrome
* on OS X.
* 移除原生默认样式，统一search的输入框样式*
* 删除 Safari 5 和 OS X 上的 Chrome 中的输入框上的内边距和搜索取消按钮。
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; /* 1 */
  -moz-appearance: none; /* 1 */
  -ms-appearance: none; /* 1 */
  -o-appearance: none; /* 1 */
  appearance: none; /* 1 */
}

/**
* 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
*    (include `-moz` to future-proof).
* 1. 修正 Safari 5 和 Chrome 中`appearance`被设置为`searchfield`的问题
* 2. 修正 Safari 5 和 Chrome 中`box-sizing`被设置为`border-box`的问题
*/
input[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  -moz-appearance: textfield; /* 1 */
  -ms-appearance: textfield; /* 1 */
  -o-appearance: textfield; /* 1 */
  appearance: textfield; /* 1 */


  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -ms-box-sizing: content-box;
  -o-box-sizing: content-box;
}

/**
* 1. Remove default vertical scrollbar in IE 8/9.
* 2. Improve readability and alignment in all browsers.*
* 1. 删除 IE8/9 中默认的垂直滚动条。
* 2. 改善所有浏览器中的可读性并使文本垂直对齐。
*/
textarea {overflow: auto; /* 1 */vertical-align: top; /* 2 */}

/**
* Don't inherit the `font-weight` (applied by a rule above).
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
* <optgroup> 标签定义选项组。optgroup 元素用于组合选项。
* optgroup 元素当您使用一个长的选项列表时，对相关的选项进行组合会使处理更加容易。
* 统一设置optgroup元素font-weight始终为bold
*/
optgroup {font-weight: bold;}



/* ==========================================================================
七、Tables表格 77777777777777777777777777777777777777777777777777777777777777
========================================================================== */
/**
* Remove most spacing between table cells.*
* 删除表格里单元格间的间距。
* 合并单元格边框，重置内边距
*/
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,th {padding: 0;}
button {

}


/* ==========================================================================
八、flex布局 8888888888888888888888888888888888888888888888888888888888888888
========================================================================== */
/**
* 封装flex布局*
* 封装flex布局
* 封装flex布局
*/
/*公共flex布局盒子模型*/
.publicFlex{
  display: -webkit-box;
  display: -ms-flex-box;
  display: -webkit-flex;
  display: -moz-box;
  display: flex;
}

/*
*@flex-direction
*@flex-direction
*/

/*公共flex布局盒子模型flex-direction-Row*/
.publicFlexDirectionRow{
  flex-direction: row;
  -ms-flex-direction: row;
  -webkit-flex-direction: row;
  -o-flex-direction: row;
  -moz-flex-direction: row;
}

/*公共flex布局盒子模型flex-direction-olumn*/
.publicFlexDirectionColumn{
  flex-direction: column;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  -o-flex-direction: column;
  -moz-flex-direction: column;
}


/*
*@flex-wrap
*@flex-wrap
*/

/*公共flex布局盒子模型 flex-wrap: wrap;*/
.publicFlexWarp{
  flex-wrap: wrap;
  -ms-flex-wrap: wrap ;
  -webkit-flex-wrap:  wrap;
  -moz-flex-wrap: wrap ;
  -o-flex-wrap:  wrap;
}


/*公共flex布局盒子模型 flex-wrap: nowrap;*/
.publicFlexNoWarp{
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap ;
  -webkit-flex-wrap:  nowrap;
  -moz-flex-wrap: nowrap ;
  -o-flex-wrap:  nowrap;
}


/*
*@justify-content
*@justify-content
*/

/*公共flex布局盒子模型 justify-content: center; */
.publicFlexJustifyCenter{
  justify-content: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
}

/*公共flex布局盒子模型 justify-content: flex-start; */
.publicFlexJustifyStart{
  justify-content: flex-start;
  -webkit-justify-content:  flex-start;
  -moz-justify-content:  flex-start;
  -ms-justify-content:  flex-start;
  -o-justify-content:  flex-start;
}

/*公共flex布局盒子模型 justify-content: flex-end; */
.publicFlexJustifyEnd{
  justify-content: flex-end;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  -ms-justify-content: flex-end;
  -o-justify-content: flex-end;
}


/*公共flex布局盒子模型 justify-content: space-between; */
.publicFlexJustifyBetween{
  justify-content: space-between;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
}


/*公共flex布局盒子模型 justify-content: space-around; */
.publicFlexJustifyAround{
  justify-content: space-around;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -ms-justify-content: space-around;
  -o-justify-content: space-around;
}


/*
*@align-items
*@align-items
*/
/*公共flex布局盒子模型   align-items: center; */
.publicFlexAlignItems{
  align-items: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;

}

/*
*@align-items
*@align-items
*/
/*公共flex布局盒子模型   align-items: center; */
.publicFlexAlignEnd{
  align-items: flex-end;
  -webkit-align-items: flex-end;
  -moz-align-items: flex-end;
  -ms-align-items: flex-end;
  -o-align-items: flex-end;

}
/*
*@ flex: 1;
*@ flex: 1;
*/
/*公共flex布局盒子模型   align-items: center; */
.publicFlexFlex{
  flex: 1;
  box-flex:1.0;
  -webkit-box-flex:1.0;
  -moz-box-flex:1.0;
  -ms-flex:1.0;
}
/* ==========================================================================
9、box-sizing盒子模型888888888888888888888888888888888888888888888888888888888
========================================================================== */
/*1. box-sizing盒子模型content-box*/
.boxSizingContentBox{
  -webkit-box-sizing: content-box;
  -o-box-sizing: content-box;
  -ms-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}


/*2. box-sizing盒子模型border-box; */
.boxSizingBorderBox{
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


/* ==========================================================================
10、text-overflow:ellipsis省略号
999999999999999999999999999999999999999999999999999999999999999999999
========================================================================== */
.textEllipsis{
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

























































